<template>
  <view class="main-pd u-p-t-28 u-p-b-80">
    <view class="u-card"  v-if="dataList.length && !loading">
      <view class="wxjj-item" v-for="item in dataList" :key="item.id" @click="$u.route('/pagesB/wxjj/wxjjDetail', { id: item.id })">
        <view class="u-line-1 font-32 color-000 fw-200">{{ item.content }}</view>
        <view class="u-flex u-flex-between u-m-t-16">
          <view class="font-32 fw-600 color-f34b47">￥{{ item.cost }}万元</view>
          <view class="font-28 color-8c8c8c">{{ item.wxTime }}</view>
        </view>
      </view>
    </view>
    <view v-show="loading">
      <u-skeleton rows="5" title loading></u-skeleton>
    </view>
      <view class="empty-con">
		<u-empty mode="list" :show="!dataList.length&&!loading"></u-empty>
	  </view>
  </view>
</template>

<script setup>
import { ref } from "vue";
import { getsyjlListApi } from "@/api/index"
import { useList } from "@/hooks/useList"
import { onLoad, onShow } from "@dcloudio/uni-app"
import useInfoStore from "@/store/user";
const userStore = useInfoStore();
const { loadData, dataList, page,loading } = useList({
  listApi: getsyjlListApi,
  otherParam: { deptId: userStore.deptId }
})
onLoad(()=>{
  page.value = 1;
  dataList.value = []
  loadData({ deptId: userStore.deptId })
})
</script>

<style lang="scss" scoped>
.wxjj-item {
  border-bottom: 1rpx solid #e6e6e6;
  padding: 28rpx 0;

  &:first-child {
    padding-top: 0;
  }

  &:last-child {
    border: none;
    padding-bottom: 0;
  }
}
</style>
